import React from 'react'
import './index.scss'
export default class GoodsItem extends React.Component {
    changeState = (id, state) => {
        this.props.fn(id, state)
    }

    render () {
        const { arr } = this.props
        return (
            <>
                {
                    arr.map(item => {
                        return (
                            <div key={item.id}>
                                <div className="my-goods-item">
                                    <div className="left">
                                        <div className="custom-control custom-checkbox">
                                            <input checked={item.goods_state} onChange={() => this.changeState(item.goods_state, item.id)} type="checkbox" className="custom-control-input" id={item.id} />
                                            <label className="custom-control-label" htmlFor={item.id}>
                                                <img
                                                    src={item.goods_img}
                                                    alt=""
                                                />
                                            </label>
                                        </div>
                                    </div>
                                    <div className="right">
                                        <div className="top">{item.goods_name}</div>
                                        <div className="bottom">
                                            <span className="price">¥ {item.goods_price}</span>
                                            <span>counter组件</span>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        )
                    })
                }
            </>

        )
    }
}